<div>
  <div class="modal-header">
    <div class="modal-title">{{ l('CreateNewTenant') }}</div>
  </div>
  <nz-spin [nzSpinning]="!tenant">
    <form nz-form
      #validateForm="ngForm"
      (ngSubmit)="save()"
      *ngIf="tenant">
      <!-- 租户名称 -->
      <nz-form-item>
        <nz-form-control nzHasFeedback>
          <input nz-input
            name="tenancyName"
            #tenancyName="ngModel"
            [(ngModel)]="tenant.tenancyName"
            [placeholder]="l('TenancyName')"
            required />
          <nz-form-explain *ngIf="tenancyName.control.dirty && tenancyName.control.errors">
            <ng-container *ngIf="tenancyName.control.hasError('required')">{{
              l('CanNotNull')
              }}</ng-container>
          </nz-form-explain>
        </nz-form-control>
      </nz-form-item>

      <!-- 名称 -->
      <nz-form-item>
        <nz-form-control nzHasFeedback>
          <input nz-input
            name="name"
            #name="ngModel"
            [(ngModel)]="tenant.name"
            [placeholder]="l('Name')"
            required />
          <nz-form-explain *ngIf="name.control.dirty && name.control.errors">
            <ng-container *ngIf="name.control.hasError('required')">{{
              l('CanNotNull')
              }}</ng-container>
          </nz-form-explain>
        </nz-form-control>
      </nz-form-item>

      <!-- 数据库链接字符串 -->
      <nz-form-item>
        <nz-form-control nzHasFeedback>
          <input nz-input
            name="connectionString"
            [(ngModel)]="tenant.connectionString"
            [placeholder]="l('DatabaseConnectionString') + '('+l('Optional')+')'" />
        </nz-form-control>
      </nz-form-item>

      <!-- 邮箱 -->
      <nz-form-item>
        <nz-form-control nzHasFeedback>
          <input nz-input
            name="adminEmailAddress"
            #adminEmailAddress="ngModel"
            [(ngModel)]="tenant.adminEmailAddress"
            [placeholder]="l('AdminEmailAddress')"
            autocomplete="name"
            required
            email />
          <nz-form-explain *ngIf="
              adminEmailAddress.control.dirty &&
              adminEmailAddress.control.errors
            ">
            <ng-container *ngIf="adminEmailAddress.control.hasError('required')">{{ l('CanNotNull') }}</ng-container>
            <ng-container *ngIf="adminEmailAddress.control.hasError('email')">{{
              l('NotEmail')
              }}</ng-container>
          </nz-form-explain>
        </nz-form-control>
      </nz-form-item>

      <!-- 激活 -->
      <nz-form-control>
        <label nz-checkbox
          name="isActive"
          [(ngModel)]="tenant.isActive">{{
          l('IsActive')
          }}</label>
      </nz-form-control>

      <!-- 默认密码 -->
      <nz-form-control>
        <label>{{ l('DefaultPasswordIs', 'bb123456') }}</label>
      </nz-form-control>

      <!-- 功能按钮 -->
      <div class="modal-footer">
        <button nz-button
          type="button"
          [disabled]="saving"
          (click)="close()">
          {{ l('Cancel') }}
        </button>
        <button nz-button
          [nzType]="'primary'"
          type="submit"
          [disabled]="!validateForm.valid || saving">
          {{ l('Save') }}
        </button>
      </div>
    </form>
  </nz-spin>
</div>
